1
00:00:00,620 --> 00:00:01,250
Alrighty.

2
00:00:01,250 --> 00:00:02,180
Welcome back.

3
00:00:02,180 --> 00:00:06,410
In this lecture we're going to start scripting the main menu for our game.

4
00:00:06,410 --> 00:00:10,850
Specifically, we want to be able to press the play button and spawn into the map.

5
00:00:10,850 --> 00:00:16,070
When the game is in the intermission stage, the plan is to have the game be in different stages.

6
00:00:16,070 --> 00:00:19,400
For example, if a wave is in progress, that would be one stage.

7
00:00:19,400 --> 00:00:24,230
If a wave is over and we're waiting for the next wave, that would be like the intermission stage and

8
00:00:24,230 --> 00:00:24,800
so on.

9
00:00:24,800 --> 00:00:28,640
So we only want players to be able to join the game during an intermission stage.

10
00:00:28,640 --> 00:00:33,290
Now, an easy way for us to know what stage the game is in would be for the server to set an attribute

11
00:00:33,290 --> 00:00:39,020
on the workspace, you could call it something like Game state or game stage or whatever, and using

12
00:00:39,020 --> 00:00:43,640
that attribute, we would check if it was appropriate for us to spawn on to the map.

13
00:00:43,730 --> 00:00:50,240
We also want to be able to display this frame right here on our screen when the player dies, and it

14
00:00:50,240 --> 00:00:52,460
will display a message of like you died.

15
00:00:52,580 --> 00:00:54,740
So this frame is very simple.

16
00:00:54,740 --> 00:00:59,900
It's just a black frame with a text label inside of it, and we want to be able to fade it onto the

17
00:00:59,900 --> 00:01:05,150
screen to completely fade out the screen like that, and then display this message right here.

18
00:01:05,150 --> 00:01:09,170
If I change the text transparency to zero, that says you died.

19
00:01:10,300 --> 00:01:13,990
So that's another thing we're going to want to add to our UI.

20
00:01:14,950 --> 00:01:16,270
So let's get started.

21
00:01:16,270 --> 00:01:20,050
We're going to create a new local script inside of our starting menu.

22
00:01:20,050 --> 00:01:24,070
And I'm going to call this my starting menu handler.

23
00:01:24,640 --> 00:01:30,370
Now inside of here I'm going to paste in a comment template that I have attached to this lecture.

24
00:01:30,370 --> 00:01:34,450
That way it's easier for us to organize our scripts.

25
00:01:35,230 --> 00:01:41,320
So we're going to have a section where we can store our services, our variables, any private functions

26
00:01:41,320 --> 00:01:41,710
we have.

27
00:01:41,710 --> 00:01:44,290
I'm going to get rid of this section because we're not going to need it.

28
00:01:44,350 --> 00:01:49,450
Any event handlers we have, and then any main functionality that we need to execute in our script.

29
00:01:49,940 --> 00:01:53,690
So for our starting menu handler, we want to first grab our starting menu.

30
00:01:53,690 --> 00:01:54,500
That's a given.

31
00:01:54,500 --> 00:01:59,420
And the easiest way to do that is that since our local script is a child of our starting menu, we can

32
00:01:59,420 --> 00:02:03,800
literally just refer to the script itself and then get the parent of our script, which would be the

33
00:02:03,800 --> 00:02:04,220
menu.

34
00:02:04,220 --> 00:02:08,630
So we could create a variable and we could call it our starting menu.

35
00:02:08,630 --> 00:02:10,640
And that's equal to script dot parent.

36
00:02:10,640 --> 00:02:14,690
Then we can go ahead and create variables for all of the other important stuff in our menu.

37
00:02:14,690 --> 00:02:20,060
For example, we can go ahead and get um, some of the frames that we're going to be using later on

38
00:02:20,060 --> 00:02:22,790
in the course, for example, the spectate frame.

39
00:02:23,180 --> 00:02:26,180
And it's going to be equal to our starting menu dot spectate frame.

40
00:02:26,180 --> 00:02:32,000
We can go ahead and grab the shop frame that's equal to the starting menu dot store frame.

41
00:02:32,210 --> 00:02:38,210
And then we can go ahead and grab um, that background or that main image where the blur is and where

42
00:02:38,210 --> 00:02:39,590
all of our play buttons are in.

43
00:02:39,590 --> 00:02:44,300
And we'll just call that blur image and that's equal to starting menu dot image label.

44
00:02:44,920 --> 00:02:49,930
Then we can go ahead and grab those buttons that are inside of our background image.

45
00:02:49,930 --> 00:02:53,710
One is our play button, so that's equal to blur image dot play.

46
00:02:53,860 --> 00:02:58,870
We can grab our shot button that's equal to blur image dot shop.

47
00:02:59,720 --> 00:03:01,100
Or I believe it's store.

48
00:03:01,100 --> 00:03:02,120
Yeah, store.

49
00:03:02,270 --> 00:03:04,970
And then we can grab our spectate.

50
00:03:06,630 --> 00:03:09,090
Button and that's equal to blur image dot.

51
00:03:09,090 --> 00:03:09,930
Spectate.

52
00:03:10,780 --> 00:03:15,460
So now what we want to do is inside of our handler section, we want to go ahead and listen for when

53
00:03:15,460 --> 00:03:17,980
our play button is clicked or touched.

54
00:03:18,160 --> 00:03:21,520
So we can refer to our play button and there's an event in there.

55
00:03:21,520 --> 00:03:28,150
Usually some people would use mouse button one click, but this event is only for people who are on

56
00:03:28,150 --> 00:03:31,840
a computer because it's going to listen for when a mouse clicks it.

57
00:03:31,840 --> 00:03:38,050
But if you want to be able to listen to all sorts of inputs, including from mobile users or even console

58
00:03:38,050 --> 00:03:45,520
users, then the best event to use for listening to input for our button is an event called activated.

59
00:03:45,520 --> 00:03:47,800
So it says fires when the button is activated.

60
00:03:47,800 --> 00:03:51,700
And this works for PC users, mobile users, and console users.

61
00:03:52,300 --> 00:03:55,570
Then we can go ahead and connect a Lambda function to this.

62
00:03:55,570 --> 00:03:57,310
So we'll connect our function.

63
00:03:58,450 --> 00:04:03,910
And when the player presses the play button, we want to make sure that the game is in the state that

64
00:04:03,910 --> 00:04:06,820
allows for us to, you know, join the game.

65
00:04:06,820 --> 00:04:11,050
So we would set that, uh, attribute on the workspace of game state.

66
00:04:11,050 --> 00:04:15,670
And then here we could check if that game state is equal to an intermission stage.

67
00:04:15,670 --> 00:04:20,830
And if it is, then we could tell the server, hey, can you respawn us and put us on the map?

68
00:04:20,830 --> 00:04:26,890
So that means we're also going to need to create a server script that's going to set the state of the

69
00:04:26,890 --> 00:04:28,720
game on the workspace.

70
00:04:29,580 --> 00:04:33,810
So another thing we could do here is we could create a new script inside of a service script service.

71
00:04:33,840 --> 00:04:35,040
This is going to be a server script.

72
00:04:35,040 --> 00:04:37,680
And I'm going to call this my game handler.

73
00:04:38,130 --> 00:04:42,780
And I'm also going to paste in that exact same template that we just pasted in previously.

74
00:04:42,780 --> 00:04:45,540
I'm going to get rid of that and I'm going to get rid of that.

75
00:04:45,840 --> 00:04:51,630
And inside of here, what we could do in the main section is we would set an attribute on the workspace.

76
00:04:51,630 --> 00:04:55,680
We could call it game state, and we could set it equal to something like a string.

77
00:04:55,680 --> 00:05:00,390
That represents what the current state of the game is like intermission or something like that.

78
00:05:00,840 --> 00:05:07,020
Now we could just use just some, uh, magic values that are just sitting here, and a magic value means

79
00:05:07,020 --> 00:05:09,930
that it's just a value that I've typed up right here.

80
00:05:09,930 --> 00:05:17,790
But if we want to be able to, like, control what the different values we should be comparing represents,

81
00:05:17,790 --> 00:05:22,350
we could create a custom enum using a module script.

82
00:05:22,350 --> 00:05:29,460
And inside of that module script, we could have a set of predefined values that represent each of the

83
00:05:29,460 --> 00:05:31,470
different stages that our game could be in.

84
00:05:32,100 --> 00:05:35,910
So we know that in enum stores different things.

85
00:05:35,910 --> 00:05:41,670
For example, in the material section it defines different constants to represent different things.

86
00:05:41,670 --> 00:05:46,590
Like for materials there's different constants to represent like a neon part or a smooth plastic part

87
00:05:46,590 --> 00:05:48,600
or a concrete part or whatever.

88
00:05:48,600 --> 00:05:51,600
So we could do the exact same thing with a module script.

89
00:05:51,600 --> 00:05:56,910
So inside of replicated storage and in our modules folder and inside of our enums folder, what we could

90
00:05:56,910 --> 00:05:59,280
do is we could create a new module script.

91
00:05:59,820 --> 00:06:04,200
And we can go ahead and call this our game state enum.

92
00:06:04,200 --> 00:06:08,430
So this module script is basically going to act as an enum for us.

93
00:06:09,050 --> 00:06:15,650
And inside of here, what we can do is simply return a table that contains those defined constants.

94
00:06:15,650 --> 00:06:22,070
So for example, one of the states that our game could be in would be the start intermission.

95
00:06:22,800 --> 00:06:27,720
And we would just set this to, uh, the same string of start intermission.

96
00:06:28,890 --> 00:06:35,310
So the start intermission would be like when all of the players join a new server, when a new server

97
00:06:35,310 --> 00:06:36,030
is created.

98
00:06:36,030 --> 00:06:39,720
Obviously there wasn't a previous wave that occurred.

99
00:06:39,720 --> 00:06:44,610
So we're basically in the beginning intermission or the starting intermission where we're waiting for

100
00:06:44,610 --> 00:06:46,650
a player to join into the game.

101
00:06:47,160 --> 00:06:51,690
And then once a player actually does join the game during the start intermission, then we could swap

102
00:06:51,690 --> 00:06:53,820
it to a regular intermission.

103
00:06:53,820 --> 00:06:59,730
And during this regular intermission is where we would have a countdown until a wave begins.

104
00:06:59,730 --> 00:07:02,070
So that countdown could be like 60s.

105
00:07:02,070 --> 00:07:08,040
And then after those 60s are up, then we could change the stage of our game to be a wave that is in

106
00:07:08,040 --> 00:07:14,820
progress, so we could create something like wave in progress, and again, just set it equal to a string.

107
00:07:14,820 --> 00:07:20,460
That is itself because we want to make this easy to access the values in.

108
00:07:20,460 --> 00:07:24,750
So that's why we're setting it up as a dictionary that has a key and a value.

109
00:07:24,750 --> 00:07:31,590
It doesn't really matter what these values are, it just matters that these values are unique from each

110
00:07:31,590 --> 00:07:37,470
other, because we want these values to represent a different, uh, stages or states that our game

111
00:07:37,470 --> 00:07:38,040
is in.

112
00:07:38,040 --> 00:07:41,340
So we can have a start intermission, a regular intermission.

113
00:07:41,340 --> 00:07:43,920
We can have a state where a wave is in progress.

114
00:07:43,920 --> 00:07:47,340
We can have another state where the game is over.

115
00:07:47,340 --> 00:07:50,700
And this one could represent when all of the players like lose.

116
00:07:50,700 --> 00:07:53,100
So all the players die, we would be in a game over.

117
00:07:53,100 --> 00:07:56,580
But if all the players win, then we could have a different, um, state for that.

118
00:07:56,580 --> 00:07:58,920
We could call it game Over win.

119
00:08:02,370 --> 00:08:08,040
And then the last state we could have is like a state where the server cleans up everything after a

120
00:08:08,040 --> 00:08:08,910
game is over.

121
00:08:08,910 --> 00:08:11,760
So we could call this state like waiting.

122
00:08:13,410 --> 00:08:19,080
And while we're in the waiting state, it'll clean everything up and then set it back to the start intermission.

123
00:08:19,080 --> 00:08:21,630
And then we'll start the loop over again.

124
00:08:21,630 --> 00:08:23,610
So it starts as a start, intermission.

125
00:08:23,610 --> 00:08:25,260
Then we go into an intermission.

126
00:08:25,260 --> 00:08:26,880
Then we go into a wave.

127
00:08:26,880 --> 00:08:31,290
If we complete the wave, then we go back to intermission and then back to wave until we complete all

128
00:08:31,290 --> 00:08:32,130
the waves.

129
00:08:32,130 --> 00:08:36,720
If the players complete all of the waves, then it's a game over and they've won.

130
00:08:36,720 --> 00:08:40,080
But if all the players die, then it's a game over and they've lost.

131
00:08:40,080 --> 00:08:43,890
And then once a game over occurs, then we're going to clean up the game.

132
00:08:43,890 --> 00:08:48,510
And then after we're done cleaning up the game, we're going to put it back into a start intermission.

133
00:08:49,240 --> 00:08:55,720
So this module script is going to store these defined constants to tell us what state our game is going

134
00:08:55,720 --> 00:08:56,320
to be in.

135
00:08:56,320 --> 00:09:03,340
So we can go ahead and grab this module script from both our server script and our local script, because

136
00:09:03,340 --> 00:09:05,140
it's inside of replicated storage.

137
00:09:05,650 --> 00:09:11,290
So we can go ahead and grab replicated storage using game git service function.

138
00:09:11,290 --> 00:09:12,460
Replicated storage.

139
00:09:13,040 --> 00:09:15,500
And then in my variable section I'll create a variable.

140
00:09:15,500 --> 00:09:17,480
I'll call it my game state enum.

141
00:09:17,480 --> 00:09:18,890
And that's going to be equal to.

142
00:09:18,890 --> 00:09:22,550
We'll use the require function to require our module script.

143
00:09:22,550 --> 00:09:26,240
And that's in replicated storage dot modules dot enums.

144
00:09:26,240 --> 00:09:28,280
And we'll get our game state enum.

145
00:09:28,370 --> 00:09:35,690
And now using our game state enum we can go ahead and set an attribute on the workspace to be for example

146
00:09:35,690 --> 00:09:37,190
the start intermission.

147
00:09:38,230 --> 00:09:45,010
So now the workspace has this string of start intermissions set on it, and then the client can check

148
00:09:45,010 --> 00:09:47,140
what string is set on the workspace.

149
00:09:47,140 --> 00:09:53,350
Compare it to the values inside of our module script to make a determination of whether or not we are

150
00:09:53,350 --> 00:09:55,450
able to spawn into the game or not.

151
00:09:56,120 --> 00:10:03,050
So when we activate this button, what we can do is we can check if the workspace git attribute and

152
00:10:03,050 --> 00:10:04,700
the attribute is game state.

153
00:10:04,700 --> 00:10:11,210
And we can check if this attribute is equal to the game states that are defined in our module script.

154
00:10:11,210 --> 00:10:14,300
So let's go ahead and get that game state enum in here as well.

155
00:10:14,690 --> 00:10:17,090
We'll create a variable game state enum.

156
00:10:17,850 --> 00:10:21,180
And then we'll also grab a replicated storage in here as well.

157
00:10:21,180 --> 00:10:24,990
So replicated storage is equal to game Getservice replicated storage.

158
00:10:24,990 --> 00:10:30,000
And I'm just going to copy what we did inside of our server script and then just paste that here.

159
00:10:30,570 --> 00:10:32,790
So now we have the game state enum on the client.

160
00:10:32,790 --> 00:10:38,370
Then we can go down and we can check if the current game state is equal to the game state enum of,

161
00:10:38,370 --> 00:10:46,890
let's say the start intermission, or if our game state is equal to the regular intermission.

162
00:10:46,890 --> 00:10:51,090
If it is, then that means we are able to spawn.

163
00:10:51,090 --> 00:10:53,220
It's okay to spawn.

164
00:10:53,580 --> 00:10:59,520
Otherwise, we know here that it's not okay to spawn, and we need to let the player know that a game

165
00:10:59,520 --> 00:11:01,320
is currently in progress.

166
00:11:01,800 --> 00:11:08,520
However, if it is okay to spawn, then what I want to do is I want to fade the player screen to black

167
00:11:08,520 --> 00:11:13,320
and then once the player screen is black, we can go ahead and tell the server, hey, respawn us.

168
00:11:13,320 --> 00:11:16,650
The server respawns us onto the map and then we can fade.

169
00:11:17,010 --> 00:11:19,560
Um, that black screen off of our screen again.

170
00:11:20,160 --> 00:11:25,350
So what we can do is I'm going to create a dedicated function for fading UI elements on my screen.

171
00:11:25,350 --> 00:11:26,670
I'm going to call it fade.

172
00:11:26,850 --> 00:11:36,210
And to this function we're going to pass a UI element as well as um, the goal that we would like to

173
00:11:36,210 --> 00:11:38,220
fade it to using the tween service.

174
00:11:38,220 --> 00:11:40,230
So we're also going to grab the tween service.

175
00:11:42,120 --> 00:11:43,230
Sequel to game jet.

176
00:11:43,230 --> 00:11:44,730
Service between service.

177
00:11:45,490 --> 00:11:46,540
And inside of here.

178
00:11:46,540 --> 00:11:49,330
What I want to do is I want to create a tween.

179
00:11:50,160 --> 00:11:54,750
Using twin service create, and that's going to be on the UI element passed to this function.

180
00:11:54,750 --> 00:11:55,770
So UI element.

181
00:11:56,860 --> 00:12:00,340
The tween info, we can just do a default of like 0.5 seconds.

182
00:12:00,340 --> 00:12:06,850
We don't want to wait too long for whatever this UI element is to fade on our screen, and then the

183
00:12:06,850 --> 00:12:09,910
goal is simply going to be the goal passed to our function.

184
00:12:11,290 --> 00:12:14,110
And now we're just going to play that tween.

185
00:12:15,000 --> 00:12:20,370
So now what we could do is we could call our fade function, and something that we want to fade onto

186
00:12:20,370 --> 00:12:23,820
our screen is going to be, for example, our black frame right here.

187
00:12:23,820 --> 00:12:27,510
So we could refer to our starting menu and pass our black frame.

188
00:12:28,220 --> 00:12:34,670
And the goal for that is that we want to update the background transparency to be completely opaque

189
00:12:34,670 --> 00:12:36,170
or set to the value of zero.

190
00:12:36,170 --> 00:12:40,730
So background transparency we want to set equal to zero.

191
00:12:41,000 --> 00:12:43,730
So now it's going to fade on to our screen.

192
00:12:44,000 --> 00:12:48,980
And we're going to wait for one second just to make sure that it's completely faded onto our screen.

193
00:12:48,980 --> 00:12:54,170
And after we have waited for one second, we can go ahead and tell the server right here, hey, please

194
00:12:54,170 --> 00:12:55,130
respawn us.

195
00:12:55,130 --> 00:13:00,860
So that means we're going to have to use a remote event to fire or communicate to the server that okay,

196
00:13:00,860 --> 00:13:04,190
my screen has been faded to black, please respawn me.

197
00:13:04,190 --> 00:13:10,340
So what we can do is inside of replicated storage and in our remotes folder and inside of the GUI folder,

198
00:13:10,340 --> 00:13:13,220
I have a remote event right here called respawn.

199
00:13:13,220 --> 00:13:15,200
So let's go ahead and make a reference to that.

200
00:13:16,030 --> 00:13:21,730
So I'll create a variable, I'll call it my respawn event and that's equal to replicated storage dot

201
00:13:21,730 --> 00:13:25,000
remotes dot g y dot respawn.

202
00:13:25,450 --> 00:13:29,290
And then I can copy this and do the exact same thing for my server script.

203
00:13:29,290 --> 00:13:32,530
Because my server script also needs to listen to this event.

204
00:13:33,360 --> 00:13:38,760
And then down here I can just get my respawn event and then I can fire to the server that I would like

205
00:13:38,760 --> 00:13:40,050
to be respawned.

206
00:13:40,470 --> 00:13:45,870
After we tell the server we would like to be respawn, I'm going to wait for another second, and then

207
00:13:45,870 --> 00:13:52,620
after that second, we're going to go ahead and fade out that black frame on our screen.

208
00:13:52,620 --> 00:14:00,960
And we also want to hide the we want to hide this menu off of our screen once we have spawned into the

209
00:14:00,960 --> 00:14:01,410
map.

210
00:14:01,410 --> 00:14:02,970
So that's very easy to do.

211
00:14:03,000 --> 00:14:08,220
We just refer to our blur image which contains all those buttons, and we're going to set the visibility

212
00:14:08,220 --> 00:14:08,940
equal to false.

213
00:14:08,940 --> 00:14:10,860
So we don't see it on our screen anymore.

214
00:14:10,980 --> 00:14:16,290
And then we're going to fade our starting menu back to be transparent again.

215
00:14:16,290 --> 00:14:22,950
So we're going to set the background transparency equal to one.

216
00:14:24,240 --> 00:14:26,760
Now going back to our game handler server script.

217
00:14:26,760 --> 00:14:31,470
What we want to do here is we want to go ahead and listen to when our respawn event gets fired.

218
00:14:31,470 --> 00:14:36,600
So we're going to listen to the on server event and connect a function to this event.

219
00:14:36,600 --> 00:14:39,660
And we're going to get the player that fired this event.

220
00:14:40,050 --> 00:14:45,030
And here we also need to make sure that the workspace has the attribute set on it.

221
00:14:45,030 --> 00:14:49,800
And it's set to a state where we can go ahead and respawn the player.

222
00:14:49,860 --> 00:14:57,180
So if the workspace get attribute game state, if it's not equal to the game state.

223
00:14:57,210 --> 00:14:58,680
Enum of start.

224
00:14:58,680 --> 00:14:59,670
Intermission.

225
00:15:00,530 --> 00:15:04,250
And it's not equal to the regular intermission.

226
00:15:04,250 --> 00:15:06,080
So workspace get attribute.

227
00:15:07,100 --> 00:15:11,720
Game state if it's not equal to the game state.

228
00:15:11,750 --> 00:15:14,330
Enum dot intermission.

229
00:15:14,630 --> 00:15:19,220
Then we're just going to return out of this function because we don't want to respond to player.

230
00:15:19,220 --> 00:15:24,050
The state of our game is in a state where we're not allowed to respond players.

231
00:15:24,620 --> 00:15:29,540
Otherwise, if we are in a state where we can respond to player, then what we want to do is we want

232
00:15:29,540 --> 00:15:32,180
to set the player to the alive team.

233
00:15:32,540 --> 00:15:36,950
And then when we set the player to the alive team, then we can reload their character, which is going

234
00:15:36,950 --> 00:15:38,840
to spawn them on the map.

235
00:15:39,530 --> 00:15:42,110
So let's go ahead and grab the team service.

236
00:15:42,110 --> 00:15:45,980
I'll just call it teams and it's equal to game get service teams.

237
00:15:47,430 --> 00:15:52,920
And here is where we would update the players team property equal to.

238
00:15:52,920 --> 00:15:55,050
And we're going to get the alive team.

239
00:15:55,050 --> 00:15:55,950
Afterwards.

240
00:15:55,950 --> 00:16:01,890
We can call the function on our player load character to create a new character for the player, removing

241
00:16:01,890 --> 00:16:02,700
the old one.

242
00:16:02,700 --> 00:16:10,770
So just like that, now when the player fires that event to us and the game is in a state where we can

243
00:16:10,770 --> 00:16:15,480
respawn them on the map, we're going to update their team to be alive and we're going to load their

244
00:16:15,480 --> 00:16:16,290
character.

245
00:16:16,320 --> 00:16:22,350
Now, another important thing we need to do is we want to make sure that when the player dies, that

246
00:16:22,350 --> 00:16:25,830
we set their team equal to the dead team.

247
00:16:25,830 --> 00:16:31,650
So another thing we want to listen to is we want to listen to the player added event to listen for when

248
00:16:31,650 --> 00:16:35,970
a player joins our game and we want to listen for when that player's character dies.

249
00:16:35,970 --> 00:16:38,460
So let's go ahead and get the player service.

250
00:16:41,020 --> 00:16:44,500
And here we can listen to the players player at an event.

251
00:16:45,020 --> 00:16:47,450
And we can grab that player from the event.

252
00:16:48,030 --> 00:16:52,560
And then we want to listen for when that player has a character added to them.

253
00:16:53,130 --> 00:16:56,310
And we'll connect a function and get that character.

254
00:16:56,310 --> 00:17:01,230
And then inside of that character we want to listen to when their humanoid dies.

255
00:17:01,230 --> 00:17:03,870
So the humanoid has an event called died.

256
00:17:03,960 --> 00:17:06,330
And we can connect a function to that.

257
00:17:06,450 --> 00:17:10,770
And this will let us know when, um, a specific player's character dies.

258
00:17:10,770 --> 00:17:16,020
When a player's character dies, then we want to update their team equal to teams.

259
00:17:16,020 --> 00:17:17,340
Dot dead.

260
00:17:18,310 --> 00:17:23,620
And then by default, we also want to make sure that when a player joins our game, that their team

261
00:17:23,620 --> 00:17:26,830
is set to the dead team by default.

262
00:17:27,460 --> 00:17:32,920
Okay, so now we should be able to test our play button that when we click it, we get spawned into

263
00:17:32,920 --> 00:17:33,490
the map.

264
00:17:33,490 --> 00:17:38,650
And that's because the server is going to set the game state equal to the start intermission, which

265
00:17:38,650 --> 00:17:41,320
is a state that we're allowed to spawn in.

266
00:17:41,320 --> 00:17:44,530
So when we click our button, our screen should fade to black.

267
00:17:44,560 --> 00:17:46,570
The server should respawn us.

268
00:17:46,570 --> 00:17:54,550
The buttons and the text of this stuff should disappear off of our screen, and then we should fade

269
00:17:54,550 --> 00:17:57,010
that black frame off of our screen again.

270
00:17:57,010 --> 00:17:58,510
So let's go ahead and try it out.

271
00:17:58,510 --> 00:18:01,060
We'll head to the test tab and hit play.

272
00:18:01,810 --> 00:18:02,830
And here we are.

273
00:18:02,830 --> 00:18:06,340
We're inside of the holding area for where all the dead players go.

274
00:18:06,340 --> 00:18:09,220
But if we go ahead and click the play button there we go.

275
00:18:09,220 --> 00:18:10,990
Our screen fades to black.

276
00:18:11,350 --> 00:18:14,560
We were set to the alive team and the screen fades back out.

277
00:18:14,560 --> 00:18:16,960
And as you can see now we are on the map.

278
00:18:16,960 --> 00:18:19,120
Very cool.

279
00:18:19,120 --> 00:18:24,670
Now the next thing we need to go ahead and do is we want to listen for when our player dies and when

280
00:18:24,670 --> 00:18:25,210
they died.

281
00:18:25,210 --> 00:18:29,890
We want to fade that black screen back onto the screen.

282
00:18:29,890 --> 00:18:33,130
And then we want to display that text of you died.

283
00:18:33,130 --> 00:18:39,100
Because if I reset, the server is going to set my team to the dead team, but my screen doesn't fade

284
00:18:39,100 --> 00:18:41,890
out and give me that dead message.

285
00:18:41,890 --> 00:18:45,580
And as you can see, I don't have access to that guy buttons anymore.

286
00:18:45,580 --> 00:18:49,030
So I can't spectate players or I can't rejoin back into the game.

287
00:18:49,030 --> 00:18:50,710
So we need to fix that.

288
00:18:51,330 --> 00:18:56,550
So what we can do in our local script is we can go ahead and grab the player service.

289
00:19:01,540 --> 00:19:04,360
And then we can make a variable for the local player.

290
00:19:04,360 --> 00:19:08,170
So that's going to be equal to players dot local player to grab us.

291
00:19:08,720 --> 00:19:14,510
And then I want to go ahead and listen to when my player has a character added, and we're basically

292
00:19:14,510 --> 00:19:17,210
going to be doing the exact same thing that the server is doing.

293
00:19:17,210 --> 00:19:20,930
We're going to listen for when my player dies and when my player dies.

294
00:19:20,930 --> 00:19:27,530
Then I want to fade the screen to black, and then I want to re-enable the visibility of the the main

295
00:19:27,530 --> 00:19:28,880
menu back on my screen.

296
00:19:29,530 --> 00:19:35,470
So when the player gets a character added, we're going to get that character and then we're going to

297
00:19:35,470 --> 00:19:36,790
get the character's humanoid.

298
00:19:36,820 --> 00:19:43,030
Now, since when the character added event gets fired, all of the children of our character may not

299
00:19:43,030 --> 00:19:44,110
be replicated right away.

300
00:19:44,110 --> 00:19:48,760
So we're going to use the wait for child function just in case, and we're going to wait for our humanoid.

301
00:19:48,760 --> 00:19:54,160
And then once we get it, we're going to get its died event and then connect a function to listen for

302
00:19:54,160 --> 00:19:55,390
when that player dies.

303
00:19:55,660 --> 00:20:02,650
Now, important thing to note is that there's a chance that our player's character is added before this

304
00:20:02,650 --> 00:20:09,700
script executes, which means we may not be able to connect a function to the died event for our player's

305
00:20:09,700 --> 00:20:10,300
character.

306
00:20:10,300 --> 00:20:15,310
So we can add an if statement here to check whether or not the player already has a character.

307
00:20:15,310 --> 00:20:21,310
So if they have a character already, then we want to go ahead and do the exact same thing that we did

308
00:20:21,310 --> 00:20:21,640
here.

309
00:20:21,640 --> 00:20:27,040
We're going to copy this, paste this there, but instead we want to replace this with player dot character.

310
00:20:27,490 --> 00:20:35,170
So this just makes sure that if the script executes after a player's character is already added, we're

311
00:20:35,170 --> 00:20:37,720
still listening to that character's died event.

312
00:20:37,990 --> 00:20:43,450
And then we can go ahead and create a dedicated function for listening for when our player's character

313
00:20:43,450 --> 00:20:48,280
dies, because we don't want to create two copies of our function in two different places.

314
00:20:48,280 --> 00:20:54,130
Instead, we want both of these event connections to refer to the same function.

315
00:20:54,130 --> 00:20:57,130
So we're going to call this function on character death.

316
00:20:58,290 --> 00:21:02,220
And then we can go ahead and connect to this function.

317
00:21:02,490 --> 00:21:08,610
So on character depth and make sure you're not calling it, but instead you're passing it to the connect

318
00:21:08,610 --> 00:21:09,300
function.

319
00:21:09,950 --> 00:21:12,080
So now we're listening for when the player dies.

320
00:21:12,080 --> 00:21:14,600
And what do we want to do when the player dies?

321
00:21:15,110 --> 00:21:19,610
Well, we want to go ahead and use our fade function, and we want to fade that starting menu dot black

322
00:21:19,610 --> 00:21:21,260
frame back onto the screen.

323
00:21:21,260 --> 00:21:25,730
So we're going to set the background transparency equal to zero.

324
00:21:25,730 --> 00:21:31,580
And then we also want to fade in that you died message which is the text label in our starting menu.

325
00:21:31,580 --> 00:21:34,820
So we can go ahead and fade in our starting menu dot black.

326
00:21:34,820 --> 00:21:37,520
We'll get the text label in there.

327
00:21:37,790 --> 00:21:44,330
And we want to go ahead and update its text transparency property and make that opaque as well.

328
00:21:46,350 --> 00:21:53,130
And then after we do that, what we want to go ahead and do is we want to wait for when the player has

329
00:21:53,130 --> 00:21:53,790
a character added.

330
00:21:53,790 --> 00:21:59,940
So we're going to refer to the character added event, and we're going to yield or wait for this event

331
00:21:59,940 --> 00:22:00,660
to fire.

332
00:22:01,260 --> 00:22:09,900
Then once the player has a character added, then we can go ahead and re-enable the blur image visibility.

333
00:22:09,900 --> 00:22:14,250
So that way we get the buttons back on our screen and then we can go ahead and fade that black menu

334
00:22:14,250 --> 00:22:14,700
back out.

335
00:22:14,700 --> 00:22:20,160
So I'll copy this, paste that here and we'll update the transparency values back to one.

336
00:22:21,220 --> 00:22:26,530
So now if our player dies, we should fade this stuff back on our screen, and then we should fade it

337
00:22:26,530 --> 00:22:29,320
back out once a player has a new character added.

338
00:22:29,320 --> 00:22:31,000
So let's go ahead and try it out.

339
00:22:31,000 --> 00:22:32,470
We'll playtest our game.

340
00:22:33,560 --> 00:22:37,190
As you can see here we are in our holding box if we play the game.

341
00:22:38,940 --> 00:22:39,780
There we go.

342
00:22:39,780 --> 00:22:40,740
We are in the map.

343
00:22:40,740 --> 00:22:45,480
And then if I die by resetting, as you can see, it says you died.

344
00:22:45,480 --> 00:22:47,520
And then there we go.

345
00:22:47,520 --> 00:22:48,660
It fades back out.

346
00:22:48,660 --> 00:22:51,840
And now we have the main menu visible again on our screen.

347
00:22:51,840 --> 00:22:52,560
Very cool.

348
00:22:52,560 --> 00:22:58,140
And then of course, we can click it again and respawned back into the map and we can die again.

349
00:22:58,140 --> 00:23:00,150
And it tells us that we've died.

350
00:23:00,990 --> 00:23:06,990
Now, one more thing we want to listen for is what happens if we click the button, but we are not in

351
00:23:06,990 --> 00:23:09,480
the start intermission or regular intermission?

352
00:23:09,480 --> 00:23:14,880
Well, what we could do is we could update the text that is inside of our play button and we could tell

353
00:23:14,880 --> 00:23:18,030
the player like, hey, please wait, there's a game in progress.

354
00:23:18,300 --> 00:23:23,610
So what we could do is we could get our play button and set the text inside of it equal to be something

355
00:23:23,610 --> 00:23:25,740
like game in progress.

356
00:23:25,950 --> 00:23:27,570
Please wait.

357
00:23:28,170 --> 00:23:33,810
And then we'll leave that display on the screen for like, um, we could wait for like three seconds.

358
00:23:33,810 --> 00:23:37,290
And then after that we could set the text back to its original text.

359
00:23:37,530 --> 00:23:39,870
So I'll create a variable, I'll call it original text.

360
00:23:39,870 --> 00:23:43,020
And that's going to be equal to play button dot text.

361
00:23:43,020 --> 00:23:46,290
So we're storing the text that was originally in our play button.

362
00:23:46,840 --> 00:23:51,580
And then we can set play button text back equal to the original text.

363
00:23:52,700 --> 00:23:59,510
So now if we go and playtest our game or actually let me go ahead and update the game state to be for

364
00:23:59,510 --> 00:24:01,400
example, like wave in progress.

365
00:24:01,400 --> 00:24:03,500
So that way we can't spawn into the map.

366
00:24:04,110 --> 00:24:07,530
If I go and play test the game and then I hit play.

367
00:24:07,680 --> 00:24:10,410
As you can see, game of progress, please wait.

368
00:24:10,830 --> 00:24:13,290
And it doesn't let me respawn into the map.

369
00:24:13,320 --> 00:24:21,210
Now there is a small problem with how we have this function set up here listening to our activated event.

370
00:24:21,630 --> 00:24:22,650
And that's if.

371
00:24:22,650 --> 00:24:24,480
What if we spam click this button.

372
00:24:24,480 --> 00:24:26,130
If I spam, click this button.

373
00:24:28,090 --> 00:24:34,600
As you can see, this text is remaining on our screen and it's not fading out.

374
00:24:34,600 --> 00:24:35,800
And that's a problem.

375
00:24:36,500 --> 00:24:43,160
And if I go and I were to set the game state back to, for example, the start intermission.

376
00:24:44,400 --> 00:24:46,920
And then I went to go play test my game again.

377
00:24:47,470 --> 00:24:51,160
And then I were to spam my button a bunch, so let me go ahead and spam it.

378
00:24:53,860 --> 00:24:56,830
As you can see, we're getting a bunch of problems here.

379
00:24:57,010 --> 00:24:59,710
We just got a whole bunch of errors in the console.

380
00:24:59,710 --> 00:25:03,010
And that's because the server.

381
00:25:03,720 --> 00:25:05,520
Had the event.

382
00:25:05,520 --> 00:25:06,420
Where is it?

383
00:25:06,420 --> 00:25:12,150
Had this event fire multiple times to reload the character over and over again and reset the player's

384
00:25:12,150 --> 00:25:14,640
team back to the alive team.

385
00:25:14,640 --> 00:25:20,670
And at the same time, we executed this chunk of code multiple times over and over and over again.

386
00:25:20,970 --> 00:25:27,480
So what we want to do is we want to basically only execute everything in here once, and then once we're

387
00:25:27,480 --> 00:25:32,910
done executing everything in here, then we can go ahead and execute everything inside of this again.

388
00:25:32,910 --> 00:25:35,130
And that's what we need to use a debounce for.

389
00:25:35,400 --> 00:25:38,430
So what we can do is we can create a variable.

390
00:25:38,610 --> 00:25:42,240
And I'm going to call this variable play button.

391
00:25:43,010 --> 00:25:46,310
Cool down and I'm going to set it equal to false.

392
00:25:46,490 --> 00:25:53,630
And then what we can do is we can go ahead and check before we do anything else, whether or not if

393
00:25:53,630 --> 00:25:56,960
our play button cool down is equal to true.

394
00:25:56,960 --> 00:26:02,420
So if we check if our play button cool down is true, then we're just going to return and not do anything.

395
00:26:03,910 --> 00:26:08,410
Otherwise, if our play button cooldown variable is not equal to true, then we're going to set it equal

396
00:26:08,410 --> 00:26:09,310
to true.

397
00:26:10,830 --> 00:26:14,520
And now that we've done this, if we spam click the button.

398
00:26:14,520 --> 00:26:20,760
All of the code in here is only going to execute once, and then after it's done executing, we can

399
00:26:20,760 --> 00:26:22,560
update the value in our play button.

400
00:26:22,560 --> 00:26:29,070
Cooldown back equal to false to allow us to, um, play or click the button again.

401
00:26:30,270 --> 00:26:32,550
So if I go and play test the game now.

402
00:26:33,170 --> 00:26:34,280
And our two spam.

403
00:26:34,280 --> 00:26:35,240
Click this button.

404
00:26:35,850 --> 00:26:37,950
It's only going to execute the code in there once.

405
00:26:37,950 --> 00:26:40,470
And as you can see, nothing bad happened.

406
00:26:40,830 --> 00:26:46,800
The same thing goes for if I set the game state to be, for example, wave in progress and I go and

407
00:26:46,800 --> 00:26:47,880
play test the game.

408
00:26:49,670 --> 00:26:50,420
If I spam.

409
00:26:50,420 --> 00:26:51,680
Click this button here.

410
00:26:54,740 --> 00:26:57,830
You can see that the text still fades out and nothing bad happened.

411
00:26:57,830 --> 00:26:59,720
If I try to spam, click it again.

412
00:27:02,080 --> 00:27:06,190
As you can see, it's still reset back to its original message and everything was fine.

413
00:27:06,190 --> 00:27:13,000
And that's because we're using this debounce to stop us from executing this function more than once.

414
00:27:13,000 --> 00:27:19,090
So Debounce is are very important when you want to control how many times you want to execute, um,

415
00:27:19,240 --> 00:27:24,760
a particular set of functionality within a function that's connected to an event.

416
00:27:24,760 --> 00:27:28,060
For example, listening to the input for our play button.

417
00:27:28,740 --> 00:27:32,100
So great job making it through this first lecture.

418
00:27:32,100 --> 00:27:37,740
And in the next lecture we're going to script our players camera where we'll have our camera rotate

419
00:27:37,740 --> 00:27:41,430
around the map while the player is in the starting menu.

420
00:27:41,430 --> 00:27:46,170
And then we're going to reset it back to the player's character when they spawn into the map.

421
00:27:46,170 --> 00:27:50,460
So we have a part above our fountain right here, this invisible part.

422
00:27:50,460 --> 00:27:51,570
It's called camera part.

423
00:27:51,570 --> 00:27:55,620
And we're going to set the position of the player's camera equal to this camera part.

424
00:27:55,620 --> 00:28:01,200
And we're going to have it slowly rotate around the map while they have the main menu visible.

425
00:28:01,200 --> 00:28:05,190
And then when they click play it's going to fade the screen to black.

426
00:28:05,190 --> 00:28:07,200
And then it's going to spawn our character into the map.

427
00:28:07,200 --> 00:28:10,650
And then we're going to reset the camera back to our player's character.

428
00:28:10,950 --> 00:28:12,750
So I'll see you there.